<template>
    <div><div @click="back">返回</div>  
        <div>用户详情</div>
        <div>
            <span>用户头像</span>
            <img :src=user.avatar_url alt=""><span>用户昵称{{user.githubUsername}}</span>
        </div>
        <div>
            <div>用户参与的文章</div>
            <div v-for="(itme,index) in usercont" :key="index">
                    <router-link :to="{path:'/cnode',query:{id:itme.id}}">
                        <p>{{itme.title}}</p>
                    </router-link>
                </div>
        </div>
        <div>
            <div>用户文章</div>
            <div v-for="(list,index) in usertop" :key="index">
                <router-link :to="{path:'/cnode',query:{id:list.id}}">
                    <p>{{list.title}}</p>
                </router-link>
            </div>
        </div>
    </div>
</template>

<script>
export default {
    name:'user' ,
    data(){
        return{
            user:[],
            usercont:[],
            usertop:[]
        }
    },
    created(){
        this.$axios({
            method:'get',
            url:' https://cnodejs.org/api/v1/user/'+ this.$route.query.name,
        }).then((response)=>{
            console.log(response.data)
            this.user=response.data.data
            this.usercont=response.data.data.recent_replies
            this.usertop=response.data.data.recent_topics
            console.log(this.usercont)
        }).catch((error)=>{
            console.log(error)
        })
    },
     methods:{
    back(){
        this.$router.go(-1);//返回上一层
    },
}}
</script>

<style scoped>
img{
    width: 50px;
}
</style>


